<template>
	<div class="deposit">
		<solt name='one'>
			<div class="title">
				<router-link to='/my'>
					<img src="../js/img/prev.png" alt="">
				</router-link>
				<span>我的积分</span>
			</div>
			<div class="balance">
				<div class="now">
					<span class="now_yue">当前积分</span>
					<router-link to="/problem">
						<span class="explain">
							<img src="../js/img/ques.png" alt="">
							积分说明
						</span>
					</router-link>
					<p>0 <span class="yuan">分</span></p>
					<button>积分兑换商品</button>
				</div>
			</div>
			<p class="transaction">最近39天积分记录</p>
			<div class="log">
				<img src="../js/img/voucher.png" alt="">
				<p>最近30天无积分记录</p>
				<p class="kuai">快去下单赚取大量积分吧</p>
			</div>
		</solt>
	</div>
</template>

<script>
</script>

<style scoped>
	.deposit {
		width: 320px;
		height: 568px;
		background-color: #F5F5F5;
	}

	.title {
		width: 320px;
		height: 39px;
		background-color: #3190E8;
		font-size: 16px;
		line-height: 39px;
		text-align: center;
	}

	.title span {
		display: inline-block;
		text-align: center;
		color: white;
	}

	.title img {
		width: 12px;
		height: 20px;
		float: left;
		margin-top: 10px;
		margin-left: 10px;
	}

	.balance {
		width: 320px;
		height: 147px;
		background-color: #3190E8;
	}

	.now {
		width: 308px;
		height: 135px;
		background-color: white;
		border-radius: 5px;
		margin: 0 auto;
	}

	.now span {
		font-size: 12px;
	}

	.now img {
		width: 12px;
		height: 12px;
	}

	.now p {
		margin-left: 10px;
		font-size: 36px;
	}

	.now button {
		width: 292px;
		height: 40px;
		border: none;
		background-color: #fe6d47;
		border-radius: 5px;
		margin: 20px 5px;
		font-size: 16px;
		color: white;
	}

	.now_yue {
		color: #666666;
		margin-top: 10px;
		margin-left: 10px;
	}

	.yuan {
		font-size: 14px;
	}

	.explain {
		float: right;
		margin-right: 10px;
		margin-top: 10px;
		color: #3190E8;
	}

	.explain img {
		margin-right: 2px;
	}

	.transaction {
		width: 320px;
		height: 40px;
		line-height: 40px;
		text-indent: 10px;
		font-size: 12px;
		color: #999999;
	}

	.log {
		width: 320px;
		height: 134px;
		text-align: center;
	}

	.log img {
		width: 160px;
		height: 100px;

	}

	.log p {
		font-size: 14px;
		color: #666666;
	}
	.kuai{
		margin-top: 5px;
		color: #999999;
	}
</style>
